<template>
     <div class="wrapper">
       <detail-header></detail-header>
       <detail-banner :allData="allData"></detail-banner>
       <detail-list :categoryList="categoryList"></detail-list>
     </div>
</template>

<script>
  import DetailHeader from '@/pages/detail/components/Header'
  import DetailBanner from '@/pages/detail/components/Banner'
  import DetailList from '@/pages/detail/components/List'
  import axios from 'axios';
    export default {
        name: "Detail",
        data () {
           return {
             categoryList :[],
             allData:{}
           }
        },
        components:{
          DetailHeader,
          DetailBanner,
          DetailList
        },
        methods:{
            getDetailInfo () {
                axios.get("static/moke/detail.json",{
                  params:{  //请求数据携带参数
                    id:this.$route.params.id
                  }
                }).then(this.getSucc)

            },
            getSucc(res){
               let data =res.data;
               if(data.ret && data.data){
                     this.categoryList=data.data.categoryList;
                     this.allData=data.data;
               }
            }
        },
        mounted () {
            this.getDetailInfo();
        }
    }
</script>
<style lang="stylus" scoped>
   .wrapper{
      height:8rem;
   }
</style>
